<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <title>用户列表</title>
    <script src="../../../static/kaige/js/szload.js"></script>
</head>

<body>
    <div class="kaige-body layui-form pagelist">
        <table class="layui-table" id="pageTable" lay-filter="pageTable" lay-size="sm"></table>
        <input type="hidden" name="keywordsCache" value="{}" />
    </div>
    <script>
        load_init_js([
            szoapcpath + '/static/kaige/js/date.js',
            szoapcpath + '/static/kaige/js/search.js',
            szoapcpath + '/static/lib/Convert_Pinyin.js',
        ], function () {
            layui.config({
                base: szoapcpath + '/static/kaige/layuiextend/'
            }).use(['element', 'form', 'layedit', 'laydate', 'table', 'kaige', 'treeTable', 'laytpl', 'tableSelect'], function () {
                var form = layui.form, table = layui.table, laydate = layui.laydate, kaige = layui.kaige, element = layui.element, treeTable = layui.treeTable, laytpl = layui.laytpl,tableSelect = layui.tableSelect;
                //系统默认图片
                window.default_image = szoapcpath + "/static/img/default.png";
                //查看图片
                window.viewImage = function (imgUrl) { kaige.viewimage({ maxwidth: 600, maxheight: 600, url: imgUrl }); }
                //上传文件
                function upfile_load_click() {
                    //头像上传
                    kaige.upload_multi_files({
                        input_id: '#inputimgguid',
                        img_id: '#srcimgurl',
                        btn: '#editimg',
                        url: szoapcpath + '/pages/files/upfiles.html?id=7'  // 前端路径
                    });
                }

                //加载列表
                kaige.table({
                    elem: '#pageTable',
                    title: '系统用户列表',
                    url: "/sys.user/index",
                    id: 'pageTable',
                    toolbar: '#dtoolbar',
                    cols: [[
                        { type: 'checkbox' },
                        { type: 'numbers', title: '序号' },
                        { field: 'phone', title: '用户', templet: '#pageinfoTpl', width: 186 },
                        { field: 'un', title: '用户名', width: 140 },
                        { field: 'type', title: '管理员', width: 100, sort: true, templet: '#type_td' },
                        // { field: 'role_name', title: '角色', width: 120, sort: true },
                        { field: 'ln', title: '登录次数', width: 120 },
                        { field: 'last_time', title: '上次登录', width: 180 },
                        { field: 'last_ip', title: '上次IP', width: 120 },
                        { field: 'status', title: '状态', templet: '#status_td', width: 120, sort: true },
                        { field: 'create_time', title: '创建时间', width: 160, hide: true },
                        { field: 'update_time', title: '更新时间', width: 160, hide: true },
                        { field: 'option', title: '操作', toolbar: '#dtrbar', align: 'center', width: 140, fixed: 'right' }
                    ]],
                    done: function (res, curr, count) {
                        //搜索框--回车提交
                        $("input[name=keywords]").on('keyup', function (e) {
                            if (event.keyCode == 13) {
                                $("#btn-search").trigger("click");
                            }
                        });
                        //给筛选表单赋值
                        form.val("searchform", {
                            "keywords": getkeywords('keywords'),
                            "search_status": getkeywords('search_status'),
                            "company_id": getkeywords('company_id') ? getkeywords('company_id') : '',
                            "company_name": getkeywords('company_name') ? getkeywords('company_name') : ''
                        });
                        dselcompany();
                        form.render(null, 'searchform');
                    }
                });

                //获取筛选表单
                function getsearchform() {
                    var gfv = {
                        "search_status": getkeywords('search_status'),
                        "keywords": getkeywords('keywords'),
                        "company_id": getkeywords('company_id') ? getkeywords('company_id') : ''
                    }
                    gfv.rnd = Math.random();
                    return gfv;
                }

                //执行重载表格
                function reload_sxtable() {
                    var where = getsearchform();
                    if (JSON.stringify(where) == "{}") {
                        layer.msg('当前没有筛选条件！'); return;
                    }
                    setTimeout(function () {
                        //执行重载
                        table.reload('pageTable', {
                            height: 'full-30'  //必须写，有时候高度不出来
                            , page: { curr: 1 } //置第一页
                            , where: where
                        });
                    }, 300);
                }

                //监听状态筛选
                form.on('select(search_status)', function (data) {
                    savekeywords('search_status', data.value);
                    reload_sxtable();
                })

                //搜索(筛选)
                function btnsearch() {
                    savekeywords('keywords', $("input[name=keywords]").val());
                    reload_sxtable();
                }

                //列表-监听表头工具栏事件dtoolbar
                table.on('toolbar(pageTable)', function (obj) {
                    var checkStatus = table.checkStatus(obj.config.id);
                    switch (obj.event) {
                        case 'btn-add':
                            /*添加*/
                            btnadd();
                            break;
                        case 'btn-delete':
                            /*删除*/
                            btndelete(checkStatus);
                            break;
                        case 'btn-search':
                            /*搜索*/
                            btnsearch();
                            break;
                    }
                });

                //列表-监听单元格行工具事件dtrbar
                table.on('tool(pageTable)', function (obj) {
                    var that = this;
                    var data = obj.data;
                    switch (obj.event) {
                        case 'edit':
                            /*修改*/
                            baredit(data);
                            break;
                        case 'del':
                            //删除
                            bardel(data);
                    }
                });

                function btndelete(d) {
                    kaige.del({
                        url: "/sys.user/del",
                        data: d.data,
                        tablelayid: 'pageTable',
                    });
                }

                //添加
                function btnadd() {
                    kaige.form({
                        url: "/sys.user/add",
                        data: {},
                        id: 'kaige',
                        area: ['750px', '600px'],
                        title: '<i class="layui-icon layui-icon-add-circle"></i> 添加用户',
                        tablelayid: 'pageTable',
                        overflow: false,
                        callbefore: function () {
                            upfile_load_click();
                            element.render('collapse');
                        }
                    });
                }

                //修改
                function baredit(d) {
                    kaige.form({
                        url: "/sys.user/edit",
                        data: { id: d.id },
                        id: 'kaige',
                        area: ['750px', '600px'],
                        title: '<i class="layui-icon layui-icon-edit"></i> 编辑用户',
                        tablelayid: 'pageTable',
                        overflow: false,
                        callbefore: function () {
                            upfile_load_click();
                            element.render('collapse');
                        },
                        postbefore: function (upd) {
                            console.log(upd);
                            return upd;
                        }
                    });
                }
                //删除
                function bardel(d) {
                    layer.confirm('您确定删除此管理员吗？', {
                        title: '<i class="layui-icon layui-icon-delete"></i> 删除确认',
                        btn: ['确认', '取消']
                    }, function () {
                        $.post("/sys.user/del", { id: d.id }, function (res) {
                            res.status && table.reload('pageTable');
                            layer.msg(res.msg);
                        });
                    });
                };
                //选择公司
                function dselcompany() {
                    tableSelect.render({
                        elem: '#sel_company',
                        searchKey: 'keywords',
                        checkedKey: 'id',
                        table: {
                            url: '/select/company',
                            cols: [[
                                { type: 'radio' },
                                { field: 'id', title: 'ID', hide: true },
                                { field: 'name', title: '单位名称' },
                                { field: 'fullname', title: '全称' }
                            ]]
                        },
                        done: function (elem, data) {
                            var NEWJSON = [], ids = [];
                            layui.each(data.data, function (index, item) {
                                NEWJSON.push(item.name);
                                ids.push(item.id);
                            })
                            $name = NEWJSON.join(",");
                            elem.val($name);
                            $ids = ids.join(",");
                            $('input[name=company_id]').val($ids);
                            savekeywords('company_name', $name);
                            savekeywords('company_id', $ids);
                            reload_sxtable();
                        }
                    })
                }
            });
        });
    </script>
    <script type="text/html" id="dtoolbar">
        <div class="layui-form" lay-filter="searchform">
            <div class="layui-inline">
                <input type="text" name="company_name"  autocomplete="off" class="layui-input" id="sel_company" placeholder="请选择公司"/>
                <input type="hidden" name="company_id"/>
            </div>
            <div class="layui-inline">
                <input class="layui-input tsinput" name="keywords" placeholder="手机/姓名">
                <button class="tsbutton" lay-event="btn-search" id="btn-search" title="筛选"><i class="layui-icon layui-icon-search"></i></button>
            </div>
            <div class="layui-inline" style="width:90px">
                <select name="search_status" lay-filter="search_status">
                    <option value="">状态</option>
                    <option value="1">启用</option>
                    <option value="2">禁用</option>
                </select>
            </div>
            <div class="layui-btn-group">
                <button type="button" class="layui-btn layui-btn-sm" lay-event="btn-add"><i class="layui-icon layui-icon-add-circle"></i> 添加</button>
                <button type="button" class="layui-btn layui-btn-sm layui-btn-danger" lay-event="btn-delete"><i class="layui-icon layui-icon-delete"></i> 删除</button>
            </div>
        </div>
    </script>
    <script type="text/html" id="dtrbar">
        <div class="layui-btn-group">
            <button class="layui-btn layui-btn-xs" lay-event="edit" title="编辑"><i class="layui-icon layui-icon-edit"></i></button>
            <button class="layui-btn layui-btn-xs" lay-event="del" title="删除"><i class="layui-icon layui-icon-delete"></i></button>
        </div>
    </script>
    <script type="text/html" id="status_td">
        <span class="layui-badge {{ d.status == 1? 'layui-bg-blue': 'layui-bg-gray'}}">{{ d.status == 1? '启用': '禁用'}}</span>
    </script>
    <script type="text/html" id="pageinfoTpl">
        <div class="pageinfotitle">
            <div class="uif-avatar">
                {{# if(d.avatar=='' || d.avatar==null) { }}
                    <a href="javascript:void(0);" onclick="viewImage('{{ window.default_image }}')">
                        <img src="{{ window.default_image }}" alt=""/>
                    </a>
                {{#  } else { }}
                    <a href="javascript:void(0);" onclick="viewImage('{{ d.avatar }}')">
                        <img src="{{ d.avatar }}" alt=""/>
                    </a>
                {{#  } }}
            </div>
            <div class="uif-info">
                {{# if(d.phone=='' || d.phone==null || d.phone=='null') { }}
                    <p>{{d.real_name}}</p>
                {{#  } else { }}
                    <p>{{d.real_name}}</p>
                    <p>{{d.phone}}</p>
                {{#  } }}
            </div>
        </div>
    </script>
    <script type="text/html" id="type_td">
        <span class="layui-badge {{ d.type == 1? 'layui-bg-blue': 'layui-bg-gray'}}">{{ d.type == 1? '是': '否'}}</span>
    </script>

    <script type="text/html" id="kaige_form_html">
        <form class="layui-form layui-form-pane kaige-body-form" lay-filter="kaige_form_lay_filter">
            {{# if(d.id){ }}
            <input type="hidden" name="id" value="{{ d.id }}" />
            {{# } }}
            <div class="layui-collapse">
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title">基本信息</h2>
                    <div class="layui-colla-content layui-show">
                        {{# if(d.id){ }}
                        <blockquote class="layui-elem-quote">注意：编辑账号的时候，如果密码为空则是不修改密码，否则，就是修改密码。</blockquote>
                        {{# } }}
                        <div class="layui-form-item">
                            <label class="layui-form-label">用户账号</label>
                            <div class="layui-input-inline" style="width:240px;">
                                {{# if(d.id){ }}
                                <input readonly disabled="disabled" name="un" value="{{ d.un || '' }}" class="layui-input layui-bg-gray">
                                {{# }else{ }}
                                <input name="un" required lay-verify="required" title="请输入用户账号" placeholder="字母数字或下划线,6-20位" class="layui-input">
                                {{# } }}
                            </div>
                            <label class="layui-form-label">真实姓名</label>
                            <div class="layui-input-inline">
                                <input name="real_name" value="{{ d.real_name || '' }}" title="请输入真实姓名" placeholder="请输入真实姓名" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">登录密码</label>
                            <div class="layui-input-inline" style="width: 240px;">
                                <input type="password" name="pwd" title="请输入密码" placeholder="请填写6到16位密码" class="layui-input">
                            </div>
                            <label class="layui-form-label">联系手机</label>
                            <div class="layui-input-inline">
                                <input type="tel" id="phone" name="phone" value="{{ d.phone || ''}}" pattern="^1[3-9][0-9]{9}$" title="请输入联系手机" placeholder="请输入联系手机" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item">
                            <label class="layui-form-label">用户头像</label>
                            <div class='layui-input-inline' style="width:80px;">
                                <img id="srcimgurl" style="height:auto;max-height:32px;min-width:32px" {{# if(d.id){ }} src="{{ d.avatar_url || '' }}"  {{# } }} />
                                <input type="hidden" name="avatar" id="inputimgguid" value="{{ d.avatar || '' }}">
                            </div>
                            <div class='layui-input-inline' style="width:151px;">
                                <a class="layui-btn layui-btn-sm" id="editimg">上传图片</a>
                            </div>
                            <label class="layui-form-label">状态</label>
                            <div class="layui-input-inline">
                                <input type="checkbox" name="status" lay-skin="switch" lay-text="正常|禁用" {{# if(d.status == 1){ }} checked="checked" {{# } }} />
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title">内联信息</h2>
                    <div class="layui-colla-content layui-show">
                        <div class="layui-form-item">
                            <label class="layui-form-label">绑定单位</label>
                            <div class="layui-input-inline" style="width: 330px;">
                                <select name="company_id" lay-filter="company_id_form" id="company_id_form">
                                    <option value="">选择单位</option>
                                    <option value="0">取消绑定</option>
                                    {{#  layui.each(d.companyList, function(index, item){ }}
                                    <option value="{{ item.id }}"  {{#  if(item.id == d.company_id ){ }} selected {{#  } }} >{{ item.name }}</option>
                                    {{#  }) }}
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-colla-item">
                    <h2 class="layui-colla-title">授权信息</h2>
                    <div class="layui-colla-content layui-show">
                        <div class="layui-form-item">
                            <label class="layui-form-label">授权角色</label>
                            <div class="layui-input-block">
                                {{# layui.each(d.roleList,function(index,item){ }}
                                <input type="checkbox" name="role_id[]" value="{{ item.id }}" lay-skin="primary" title="{{ item.name }}" {{# if (item.checked){ }} checked="" {{# } }}>
                                {{#  }) }}
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">管理员否</label>
                            <div class="layui-input-inline">
                                <input type="checkbox" name="type" lay-skin="switch" lay-text="管理员|普通"  {{# if (d.type == 1){ }}checked=""{{# } }} />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item layui-hide">
                <button class="layui-hide" lay-submit="" id="kaige_form_btn_save" lay-filter="kaige_form_btn_save">保存数据</button>
            </div>
        </form>
    </script>
</body>

</html>